<template>
  <j-modal
    :title="title"
    :width="800"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    
    <a-spin :spinning="confirmLoading">
      <a-form :form="form">
      
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="游戏名称">
          <j-dict-select-tag v-decorator="['name', validatorRules.name]"
                             :triggerChange="true"
                             placeholder="请选择游戏"
                             dictCode='sys_category where pid = "0",name,id'/>
          <!--<a-input placeholder="请输入游戏名id(字典)" v-decorator="['name', {}]" />-->
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="比赛名称">
          <a-input placeholder="请输入比赛名称" v-decorator="['matchName', validatorRules.matchName]" :max-length="10"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          :required="true"
          label="门票海报">
          <j-image-upload text="上传" v-model="matchPoster" ></j-image-upload>
        </a-form-item>
        <!--<a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          :required="true"
          label="比赛列表图片">
          <j-image-upload text="上传" v-model="matchPic" ></j-image-upload>
          &lt;!&ndash;<a-input placeholder="请输入比赛列表图片" v-decorator="['matchPic', {}]" />&ndash;&gt;
        </a-form-item>-->
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          :required="true"
          label="比赛详情图片">
          <j-image-upload text="上传" v-model="matchDetailPic" ></j-image-upload>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="门票名称">
          <a-input placeholder="请输入门票名称" v-decorator="['ticket', validatorRules.ticket]" :max-length="20"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="排序">
          <a-input-number placeholder="请输入排序" v-decorator="['sort', validatorRules.sort]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="注册送门票">
          <j-dict-select-tag v-decorator="['remark1', validatorRules.name]"
                             :triggerChange="true"
                             placeholder="注册送门票"
                             dictCode='yn'/>
          <!--<a-input placeholder="请输入游戏名id(字典)" v-decorator="['name', {}]" />-->
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="价格（元）">
          <a-input-number v-decorator="[ 'price', validatorRules.price]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          :required="true"
          label="门票图片">
          <j-image-upload text="上传" v-model="ticketPic" ></j-image-upload>
          <!--<a-input-number v-decorator="[ 'ticketPic', validatorRules.extension]" hidden/>-->
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="代理直推佣金（元）">
          <a-input-number v-decorator="[ 'extensionOne', validatorRules.extensionOne]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="代理佣金（元）">
          <a-input-number v-decorator="[ 'agent', validatorRules.agent]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="推广佣金（元）">
          <a-input-number v-decorator="[ 'extension', validatorRules.extension]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="青铜佣金（元）">
          <a-input-number v-decorator="[ 'bronze', validatorRules.bronze]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="白银佣金（元）">
          <a-input-number v-decorator="[ 'silver', validatorRules.silver]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="黄金佣金（元）">
          <a-input-number v-decorator="[ 'gold', validatorRules.gold]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="白金佣金（元）">
          <a-input-number v-decorator="[ 'platinum', validatorRules.platinum]" :min="0"/>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="钻石佣金（元）">
          <a-input-number v-decorator="[ 'diamonds', validatorRules.diamonds]" :min="0"/>
        </a-form-item>

        <!--<a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="0:正常,1:删除">
          <a-input placeholder="请输入0:正常,1:删除" v-decorator="['delflag', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark">
          <a-input placeholder="请输入remark" v-decorator="['remark', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark1">
          <a-input placeholder="请输入remark1" v-decorator="['remark1', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark2">
          <a-input placeholder="请输入remark2" v-decorator="['remark2', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark3">
          <a-input placeholder="请输入remark3" v-decorator="['remark3', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark4">
          <a-input placeholder="请输入remark4" v-decorator="['remark4', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark5">
          <a-input placeholder="请输入remark5" v-decorator="['remark5', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark6">
          <a-input placeholder="请输入remark6" v-decorator="['remark6', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark7">
          <a-input placeholder="请输入remark7" v-decorator="['remark7', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark8">
          <a-input placeholder="请输入remark8" v-decorator="['remark8', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark9">
          <a-input placeholder="请输入remark9" v-decorator="['remark9', {}]" />
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="remark10">
          <a-input placeholder="请输入remark10" v-decorator="['remark10', {}]" />
        </a-form-item>-->
		
      </a-form>
    </a-spin>
  </j-modal>
</template>

<script>
  import { httpAction } from '@/api/manage'
  import pick from 'lodash.pick'
  import moment from "moment"
  import JImageUpload from '@/components/jeecg/JImageUpload'

  export default {
    name: "NameModal",
    components: { JImageUpload},
    data () {
      return {
        title:"操作",
        visible: false,
        model: {},
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },

        confirmLoading: false,
        form: this.$form.createForm(this),
        validatorRules:{
          name:{rules: [{ required: true, message: '请选择游戏名称!' }]},
          matchName:{rules: [{ required: true, message: '请输入比赛名称!' }]},
          ticket:{rules: [{ required: true, message: '请输入门票名称!' }]},
          price:{rules: [{ required: true, message: '请输入价格!' }]},
          extensionOne:{rules: [{ required: true, message: '请输入代理直推佣金!' }]},
          extension:{rules: [{ required: true, message: '请输入推广佣金!' }]},
          agent:{rules: [{ required: true, message: '请输入代理佣金!' }]},
          bronze:{rules: [{ required: true, message: '请输入青铜佣金!' }]},
          silver:{rules: [{ required: true, message: '请输入白银佣金!' }]},
          gold:{rules: [{ required: true, message: '请输入黄金佣金!' }]},
          platinum:{rules: [{ required: true, message: '请输入白金佣金!' }]},
          diamonds:{rules: [{ required: true, message: '请输入钻石佣金!' }]},
          sort:{rules: [{ required: true, message: '请输入排序!' }]},
        },
        url: {
          add: "/name/name/add",
          edit: "/name/name/edit",
        },
        matchPoster:'',
        // matchPic:'',
        matchDetailPic:'',
        ticketPic:'',
      }
    },
    created () {
    },
    methods: {
      add () {
        this.edit({});
      },
      edit (record) {
        this.form.resetFields();
        record.delflag = "0";
        this.model = Object.assign({}, record);
        this.visible = true;
        this.$nextTick(() => {
          this.form.setFieldsValue(pick(this.model,'name','matchName','matchPoster','matchPic','matchDetailPic','ticket','price','ticketPic','extensionOne','extension','agent','bronze','silver','gold','platinum','diamonds','sort','delflag','remark','remark1','remark2','remark3','remark4','remark5','remark6','remark7','remark8','remark9','remark10'))
		  //时间格式化
          this.matchPoster = record.matchPoster;
          // this.matchPic = record.matchPic;
          this.matchDetailPic = record.matchDetailPic;
          this.ticketPic = record.ticketPic;
        });

      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        const that = this;
        if(this.matchPoster =="" || this.matchPoster == null){
          this.$message.warning("请上传比赛海报！");
          return false;
        }
        /*if(this.matchPic =="" || this.matchPic == null){
          this.$message.warning("请上传比赛列表海报！");
          return false;
        }*/
        if(this.matchDetailPic =="" || this.matchDetailPic == null){
          this.$message.warning("请上传比赛详情海报！");
          return false;
        }
        if(this.ticketPic =="" || this.ticketPic == null){
          this.$message.warning("请上传门票图片！");
          return false;
        }
        // 触发表单验证
        this.form.validateFields((err, values) => {
          if (!err) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            let formData = Object.assign(this.model, values);
            //时间格式化
            formData.matchPoster = this.matchPoster;
            // formData.matchPic = this.matchPic;
            formData.matchDetailPic = this.matchDetailPic;
            formData.ticketPic = this.ticketPic;
            console.log(formData)
            httpAction(httpurl,formData,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
              that.close();
            })



          }
        })
      },
      handleCancel () {
        this.close()
      },


    }
  }
</script>

<style lang="less" scoped>

</style>